var pageSize = 10;
var pageNum = 1;
var page;
var laypage;
var list;
var layer;


$(function () {
    $("#menuId").val(sessionStorage.menuId);
    sessionStorage.rmId = sessionStorage.menuId;
    // alert("000"+sessionStorage.menuId);
    layui.use(['laydate','element','laypage','layer'], function(){
        $ = layui.jquery;//jquery
        laydate = layui.laydate;//日期插件
        element = layui.element();//面包导航
        laypage = layui.laypage;//分页
        layer = layui.layer;//弹出层


    });
    setTimeout(function () {
        findClassifyList();
    },200);

});



//查询分类列表
function findClassifyList(){
    var menuId = $("#menuId").val();
    if(sessionStorage.getItem(menuId+'add') == 1){
        $("#addClassify").css('display','inline');
    }

    var params = {
        "type":"query",
        "menuId":menuId,
        "pageSize":pageSize,
        "pageNum":pageNum

    };
    $.ajax({
        type:"post",
        url: "/businessShop/findClassifyList",
        data:params,
        dataType: "json",
        success : function(data){
            if(data.code == 1 && data.code != undefined){
                list = data.classifies;
                page = data.page;
                var html = "";
                for(var b in list){

                    var level = "";
                    if(list[b].level == 1){
                        level = "一级分类";
                    }else if(level == 2){
                        level = "二级分类";
                    }
                    var state = "";
                    if(list[b].state == 0){
                        state = "有效";
                    }else if(list[b].state == 1){
                        state = "无效";
                    }

                    html += '<tr><td>'+(list[b].label == null ? "" : list[b].label)+'</td>' +
                        '<td>'+list[b].classifyName+'</td>' +
                        '<td><img src="'+list[b].classifyIcon+'" style="width: 50px"/></td>' +
                        '<td>'+list[b].classifyOrder+'</td>' +
                        '<td>'+level+'</td>' +
                        '<td>'+state+'</td>' +
                        '<td>'+(list[b].createTime == null ? "" : new Date(list[b].createTime).toLocaleString())+'</td>' +
                        '<td>'+(list[b].modifyTime == null ? "" : new Date(list[b].modifyTime).toLocaleString())+'</td><td>';
                    if(sessionStorage.getItem(menuId+'edit') == 1){
                       html +=  '<button class="layui-btn layui-btn-normal" onclick="showUpdatePage('+b+')">编辑</button>';
                    }
                    if(sessionStorage.getItem(menuId+'del') == 1){
                        html += '<button class="layui-btn layui-btn-danger" onclick="showDelPage('+list[b].id+')">删除</button>';
                    }
                    html += '</td></tr>';
                }
                $("#bus").html(html);
                $("#total").html("共有数据："+page.total+" 条");
                laypage({
                    cont: 'page'
                    ,pages: page.pages
                    ,first: 1
                    ,curr:pageNum
                    ,last: page.pages
                    ,prev: '<em><</em>'
                    ,next: '<em>></em>'
                    ,jump: function (obj,first) {
                        pageNum = obj.curr;
                        if(!first){
                            findClassifyList();
                        }
                    }
                });
            }else if(data == 9999 && data != undefined){
                window.location.href = "/login_toLogin";
            }else if(data == 1111 && data != undefined){
                alert("无权操作");
            }
        }

    });
}


//打开添加分类页面
var addIndex;
function showAddClassfiyPage(level){
    var title = "添加分类";
    if(level == 1){
        title = "添加一级分类"
    }
    var html = '<div  style="padding: 8% 2%;height: 310px;text-align: center">'+
        '<label style="margin-right: 30px">分类编号:</label><input id="label" style="width: 180px;height: 30px" placeholder="分类编号"/><br/><br/>'+
        '<label style="margin-right: 30px">分类名称:</label><input id="classifyName" style="width: 180px;height: 30px" placeholder="分类名称"/><br/><br/>'+
        '<label style="margin-right: 30px">分类图标:</label><div id="d" onclick="icon.click()" style="display: inline-block;width: 180px;height: 30px;border: 1px solid darkgrey;cursor: pointer"><input id="icon" onchange="preview(this)" type="file" style="display: none;"/><label id="t" style="cursor: pointer">点击上传图标</label><img id="img" src="" style="height: 28px;"/></div><br/><br/>'+
        '<label style="margin-right: 30px">分类排序:</label><input id="classifyOrder" style="width: 180px;height: 30px" placeholder="分类排序"/><br/><br/>'+
        '<label style="margin-right: 30px">分类状态:</label><div style="display: inline-block;width: 180px;height: 30px;"><input type="radio" name="state" value="0" style="width: 28px;height: 28px;" checked="checked"/>有效<input type="radio" name="state" value="1" style="width: 28px;height: 28px;margin-left: 40px"/>无效</div></div><br/><br/>'+
        '<div style="width: 100%;text-align: center;"><button onclick="addClassify(this,'+level+')" class="layui-btn layui-btn-normal" style="margin: 10px auto 20px;width: 200px">提交</button></div>';

    addIndex = layer.open({
        title: [title,'color: #2299ee;border-bottom: 1px solid;']
        ,type: 1
        ,content: html
        ,area: ['500px', '550px']
        ,maxmin:true
    });
}

//图片预览
function preview(file) {
    var prevDiv = document.getElementById('d');
    if(!file.files[0]){
        $("#img").attr("src","");
        $("#img").css("display","none");
        $("#t").css("display","block");
        $(prevDiv).attr("line-height","30px");
        return;
    }

    var fileType = file.files[0].type;
    if(fileType != "image/pjpeg" && fileType != "image/jpeg" && fileType != "image/x-png" && fileType != "image/png"){
        alert("图片类型错误");
        return false;
    }
    if (file.files && file.files[0]) {
        var reader = new FileReader();
        reader.onload = function (evt) {
            $("#t").css("display","none");
            $(prevDiv).removeAttr("line-height");
            $("#img").attr("src",evt.target.result);
            $("#img").css("display","block");
            // prevDiv.innerHTML = '<input onchange="preview(this,'+id+')" id="im'+id+'" type="file" style="display: none"/><img src="' + evt.target.result + '" style="width: 150px;height: 150px;"/>';
        }
        reader.readAsDataURL(file.files[0]);
    } else {
        prevDiv.innerHTML = '<input onchange="preview(this)" id="icon" type="file" style="display: none"/><div class="img" style="filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale,src=\'' + file.value + '\'"></div>';
    }
}

//添加分类
function addClassify(obj,level) {
    $(obj).attr("disabled",true);
    $(obj).attr("class","layui-btn layui-btn-disabled");
    var label = $("#label").val();
    var classifyName = $("#classifyName").val();
    var icon = $("#icon")[0].files[0];
    var classifyOrder = $("#classifyOrder").val();
    var state = $("input[name=state]:checked").val();
    if(label == ""){
        alert("分类编号不能为空");
        $(obj).attr("disabled",false);
        $(obj).attr("class","layui-btn layui-btn-normal");
        return false;
    }
    if(isNaN(label)){
        alert("分类编号填写错误");
        $(obj).attr("disabled",false);
        $(obj).attr("class","layui-btn layui-btn-normal");
        return false;
    }
    if(classifyName == ""){
        alert("分类名称不能为空");
        $(obj).attr("disabled",false);
        $(obj).attr("class","layui-btn layui-btn-normal");
        return false;
    }
    // if(icon == undefined){
    //     alert("分类图标不能为空");
    //     $(obj).attr("disabled",false);
    //     $(obj).attr("class","layui-btn layui-btn-normal");
    //     return false;
    // }
    if(classifyOrder == ""){
        alert("分类排序不能为空");
        $(obj).attr("disabled",false);
        $(obj).attr("class","layui-btn layui-btn-normal");
        return false;
    }
    if(isNaN(classifyOrder)){
        alert("分类排序填写错误");
        $(obj).attr("disabled",false);
        $(obj).attr("class","layui-btn layui-btn-normal");
        return false;
    }

    var menuId = $("#menuId").val();
    var formData = new FormData();
    formData.append("type","add");
    formData.append("menuId",menuId);
    formData.append("label",label);
    formData.append("classifyName",classifyName);
    formData.append("classifyOrder",classifyOrder);
    formData.append("state",state);
    formData.append("file",icon);
    formData.append("level",level);

    $.ajax({
        type: "post",
        url: "/businessShop/addClassify",
        data:formData,
        processData : false,
        contentType : false,
        dataType: "json",
        success: function (data) {
            if(data.code == 1 && data.code != undefined){
                alert("添加成功");
                layer.close(addIndex);
                findClassifyList();
            }else if(data.code == 2 && data.code != undefined){
                alert(data.message);
                $(obj).attr("disabled",false);
                $(obj).attr("class","layui-btn layui-btn-normal");
                layer.close(addIndex);
                findClassifyList();
            }else if(data == 9999 && data != undefined){
                window.location.href = "/login_toLogin";
            }else if(data == 1111 && data != undefined){
                alert("无权操作");
                $(obj).attr("disabled",false);
                $(obj).attr("class","layui-btn layui-btn-normal");
                layer.close(addIndex);
                findClassifyList();
            }else if(data.code == 3 && data.code != undefined){
                alert("系统异常,请联系管理员");
                layer.close(addIndex);
                findClassifyList();
            }
        }
    });
}
//打开编辑分类页面
var updateIndex;
function showUpdatePage(b) {
    var classify = list[b];
    var html = '<div  style="padding: 8% 2%;height: 310px;text-align: center">'+
        '<label style="margin-right: 30px">分类编号:</label><input id="upLabel" style="width: 180px;height: 30px" value="'+classify.label+'"/><br/><br/>'+
        '<label style="margin-right: 30px">分类名称:</label><input id="upClassifyName" style="width: 180px;height: 30px" value="'+classify.classifyName+'"/><br/><br/>';
    if(classify.classifyIcon == null){
        html += '<label style="margin-right: 30px">分类图标:</label><div id="upd" onclick="upicon.click()" style="display: inline-block;width: 180px;height: 30px;border: 1px solid darkgrey;cursor: pointer"><input id="upicon" onchange="updatePreview(this)" type="file" style="display: none;"/><label id="upt" style="cursor: pointer">点击上传图标</label><img id="upimg" src="'+classify.classifyIcon+'" style="height: 30px;float: left;"/></div><br/><br/>';

    }else {
        html += '<label style="margin-right: 30px">分类图标:</label><div id="upd" onclick="upicon.click()" style="display: inline-block;width: 180px;height: 30px;border: 1px solid darkgrey;cursor: pointer"><input id="upicon" onchange="updatePreview(this)" type="file" style="display: none;"/><img id="upimg" src="'+classify.classifyIcon+'" style="height: 30px;float: left;"/></div><br/><br/>';
    }
    html += '<label style="margin-right: 30px">分类排序:</label><input id="upClassifyOrder" style="width: 180px;height: 30px" value="'+classify.classifyOrder+'"/><br/><br/>';
    if(classify.state == 0){
        html += '<label style="margin-right: 30px">分类状态:</label><div style="display: inline-block;width: 180px;height: 30px;"><input type="radio" name="upstate" value="0" style="width: 28px;height: 28px;" checked="checked"/>有效<input type="radio" name="upstate" value="1" style="width: 28px;height: 28px;margin-left: 40px"/>无效</div></div><br/><br/>';
    }else if(classify.state == 1){
        html += '<label style="margin-right: 30px">分类状态:</label><div style="display: inline-block;width: 180px;height: 30px;"><input type="radio" name="upstate" value="0" style="width: 28px;height: 28px;" />有效<input type="radio" name="upstate" value="1" style="width: 28px;height: 28px;margin-left: 40px" checked="checked"/>无效</div></div><br/><br/>';
    }
        html += '<div style="width: 100%;text-align: center;"><button onclick="updateClassify(this,'+classify.id+')" class="layui-btn layui-btn-normal" style="margin: 10px auto 20px;width: 200px">提交</button></div>';

    updateIndex = layer.open({
        title: ['编辑分类','color: #2299ee;border-bottom: 1px solid;']
        ,type: 1
        ,content: html
        ,area: ['500px', '550px']
        ,maxmin:true
    });
}
//修改图片预览
function updatePreview(file) {
    var prevDiv = document.getElementById('upd');
    if(!file.files[0]){
        $("#upimg").attr("src","");
        $("#upimg").css("display","none");
        $("#upt").css("display","block");
        $(prevDiv).attr("line-height","30px");
        return;
    }

    var fileType = file.files[0].type;
    if(fileType != "image/pjpeg" && fileType != "image/jpeg" && fileType != "image/x-png" && fileType != "image/png"){
        alert("图片类型错误");
        return false;
    }
    if (file.files && file.files[0]) {
        var reader = new FileReader();
        reader.onload = function (evt) {
            $("#upt").css("display","none");
            $(prevDiv).removeAttr("line-height");
            $("#upimg").attr("src",evt.target.result);
            $("#upimg").css("display","block");
            // prevDiv.innerHTML = '<input onchange="preview(this,'+id+')" id="im'+id+'" type="file" style="display: none"/><img src="' + evt.target.result + '" style="width: 150px;height: 150px;"/>';
        }
        reader.readAsDataURL(file.files[0]);
    } else {
        prevDiv.innerHTML = '<input onchange="updatePreview(this)" id="upicon" type="file" style="display: none"/><div class="upimg" style="filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale,src=\'' + file.value + '\'"></div>';
    }
}
//编辑分类
function updateClassify(obj,id) {
    $(obj).attr("disabled",true);
    $(obj).attr("class","layui-btn layui-btn-disabled");
    var upLabel = $("#upLabel").val();
    var upClassifyName = $("#upClassifyName").val();
    var upicon = $("#upicon")[0].files[0];
    var upClassifyOrder = $("#upClassifyOrder").val();
    var upstate = $("input[name=upstate]:checked").val();
    var imgurl = $("#upimg").attr("src");
    if(upLabel == ""){
        alert("分类编号不能为空");
        $(obj).attr("disabled",false);
        $(obj).attr("class","layui-btn layui-btn-normal");
        return false;
    }
    if(isNaN(upLabel)){
        alert("分类编号填写错误");
        $(obj).attr("disabled",false);
        $(obj).attr("class","layui-btn layui-btn-normal");
        return false;
    }
    if(upClassifyName == ""){
        alert("分类名称不能为空");
        $(obj).attr("disabled",false);
        $(obj).attr("class","layui-btn layui-btn-normal");
        return false;
    }
    // if(imgurl == undefined || imgurl == ""){
    //     alert("分类图标不能为空");
    //     $(obj).attr("disabled",false);
    //     $(obj).attr("class","layui-btn layui-btn-normal");
    //     return false;
    // }
    if(upClassifyOrder == ""){
        alert("分类排序不能为空");
        $(obj).attr("disabled",false);
        $(obj).attr("class","layui-btn layui-btn-normal");
        return false;
    }
    if(isNaN(upClassifyOrder)){
        alert("分类排序填写错误");
        $(obj).attr("disabled",false);
        $(obj).attr("class","layui-btn layui-btn-normal");
        return false;
    }

    var menuId = $("#menuId").val();
    var formData = new FormData();
    formData.append("type","change");
    formData.append("menuId",menuId);
    formData.append("id",id);
    formData.append("classifyName",upClassifyName);
    formData.append("classifyOrder",upClassifyOrder);
    formData.append("state",upstate);
    formData.append("file",upicon);
    formData.append("label",upLabel);
    $.ajax({
        type: "post",
        url: "/businessShop/updateClassify",
        data:formData,
        processData : false,
        contentType : false,
        dataType: "json",
        success: function (data) {
            if(data.code == 1 && data.code != undefined){
                alert("修改成功");
                layer.close(updateIndex);
                findClassifyList();
            }else if(data.code == 2 && data.code != undefined){
                alert(data.message);
                $(obj).attr("disabled",false);
                $(obj).attr("class","layui-btn layui-btn-normal");
                layer.close(updateIndex);
                findClassifyList();
            }else if(data == 9999 && data != undefined){
                window.location.href = "/login_toLogin";
            }else if(data == 1111 && data != undefined){
                alert("无权操作");
                $(obj).attr("disabled",false);
                $(obj).attr("class","layui-btn layui-btn-normal");
                layer.close(updateIndex);
                findClassifyList();
            }else if(data.code == 3 && data.code != undefined){
                alert("系统异常,请联系管理员");
                layer.close(updateIndex);
                findClassifyList();
            }
        }
    });
}

//打开删除页面
var delIndex;
function showDelPage(id) {
    var html = "<div style='text-align: center'><p style='margin-bottom: 30px'>确定删除吗?</p><button onclick='delClassify("+id+","+1+",this)' class='layui-btn layui-btn-normal'>确定</button><button onclick='delClassify("+id+","+2+",this)' class='layui-btn layui-btn-normal' style='background-color: #ff5722;margin-left: 100px'>取消</button></div>"
    delIndex = layer.open({
        title: ['提示','color: #2299ee;border-bottom: 1px solid;']
        ,type: 1
        ,content: html
        ,area: ['300px', '150px']
        ,maxmin:true
    });
}
//删除分类
function delClassify(id,index,obj) {
    $(obj).attr("disabled",true);
    if(index == 2){
        layer.close(delIndex);
        return false;
    }
    var menuId = $("#menuId").val();
    var params = {
        "type":"del",
        "menuId":menuId,
        "id":id
    };
    $.ajax({
        type:"post",
        url:"/businessShop/delClassify",
        data:params,
        dataType:"json" ,
        success :function (data) {

            if(data.code == 1 && data.code != undefined){
                alert("删除成功");
                layer.close(delIndex);
                findClassifyList();
            }else if(data == 9999 && data != undefined){
                window.location.href = "/login_toLogin";
            }else if(data == 1111 && data != undefined){
                alert("无权操作");
                $(obj).attr("disabled",false);
                layer.close(delIndex);
                findClassifyList();
            }else if(data.code == 2 && data.code != undefined){
                alert("删除失败");
                $(obj).attr("disabled",false);
                layer.close(delIndex);
                findClassifyList();
            }else if(data.code == 3 && data.code != undefined){
                alert("系统异常,请联系管理员");
                layer.close(delIndex);
                findClassifyList();
            }
        }
    });
}